支持多平台+高颜值的网易云第三方播放器

大家好，我是TJ

关注TJ君，回复“武功秘籍”免费获取计算机宝典书籍

TJ君将之前发过的各种项目及工具进行了整理，收录到了GitHub项目，欢迎各位小伙伴光临Star，地址如下：https://github.com/Wechat-TJ/TJ-WORLD-FORU

上海的天气真是阴晴不定，这两天又是降温又是下雨，加上疫情的隔离，真是让人很不舒服，TJ君觉得此情此景应该听一点开心暖心的歌曲，让自己变得快乐起来，所以今天来和大家分享一个可以支持多平台（macOS、Windows、Linux）的高颜值第三方网易云播放器，YesPlayMusic

YesPlayMusic的主要特性有：

• 使用 Vue.js 全家桶开发
• 支持网易云账号登录（扫码/手机/邮箱登录）
• 支持 MV 播放
• 支持歌词显示
• 支持私人 FM / 每日推荐歌曲
• 无任何社交功能
• 海外用户可直接播放（需要登录网易云账号）
• 支持 UnblockNeteaseMusic，自动使用各类音源替换变灰歌曲链接 （网页版不支持）
• 「各类音源」指默认启用的音源。
• 每日自动签到（手机端和电脑端同时签到）
• Light/Dark Mode 自动切换
• 支持 Touch Bar
• 支持 PWA，可在 Chrome/Edge 里点击地址栏右边的 ➕ 安装到电脑
• 支持 Last.fm Scrobble
• 支持音乐云盘
• 自定义快捷键和全局快捷键
• 支持Mpris

YesPlayMusic提供了各式各样的安装包，可谓应有尽有

当然，小伙伴们也可以选择将本项目部署到Vercel或自己的服务器上。

部署Vercel服务器

• 部署网易云 API，详情参见 Binaryify/NeteaseCloudMusicApi 。

• 点击本仓库右上角的 Fork，复制本仓库到自己的 GitHub 账号。

• 点击仓库的 Add File，选择 Create new file，输入 vercel.json，将下面的内容复制粘贴到文件中，并将 https://your-netease-api.example.com 替换为你刚刚部署的网易云 API 地址：

{
  "rewrites": [
    {
      "source": "/api/:match*",
      "destination": "https://your-netease-api.example.com/:match*"
    }
  ]
}

• 打开 Vercel.com，使用 GitHub 登录。

• 点击 Import Git Repository 并选择你刚刚复制的仓库并点击 Import。

• 点击 PERSONAL ACCOUNT 旁边的 Select。

• 点击 Environment Variables，填写 Name 为 VUE_APP_NETEASE_API_URL，Value 为 /api，点击 Add。最后点击底部的 Deploy 就可以部署到 Vercel 了。

部署自己服务器

• 部署网易云 API，详情参见 Binaryify/NeteaseCloudMusicApi

• 克隆本仓库

• 安装依赖

yarn install

• （可选）使用 Nginx 反向代理 API，将 API 路径映射为 /api，如果 API 和网页不在同一个域名下的话（跨域），会有一些 bug。

• 复制 /.env.example 文件为 /.env，修改里面 VUE_APP_NETEASE_API_URL 的值为网易云 API 地址。本地开发的话可以填写 API 地址为 http://localhost:3000，YesPlayMusic 地址为 http://localhost:8080。如果你使用了反向代理 API，可以填写 API 地址为 /api。

VUE_APP_NETEASE_API_URL=http://localhost:3000

• 编译打包

yarn run build

• 将 /dist 目录下的文件上传到你的 Web 服务器

部署Docker

• 构建 Docker Image

docker build -t yesplaymusic .

• 启动 Docker Container

docker run -d --name YesPlayMusic -p 80:80 yesplaymusic

• Docker Compose 启动

docker-compose up -d

YesPlayMusic 地址为 http://localhost

配置开发环境

运行本项目

# 安装依赖
yarn install

# 创建本地环境变量
cp .env.example .env

# 运行（网页端）
yarn serve

# 运行（electron）
yarn electron:serve

本地运行 NeteaseCloudMusicApi，或者将 API 部署至 Vercel

# 运行 API （默认 3000 端口）
yarn netease_api:run

让我们一起里看下他的高颜值究竟怎么样：

看着还是蛮漂亮的对吧~那就赶紧来试试吧~

点击下方卡片，关注公众号“TJ君”

回复“PlayMusic2022”，获取仓库地址

关注我，每天了解一个牛x、好用、有趣的东东

往期推荐